<template>
  <div>
    <!--    新增按钮-->
    <t-button @click="openDialog">新增护理等级</t-button>

    <SearchForm @onResetEmit="onReset" @onSubmitEmit="onSubmit"></SearchForm>

  </div>
  <!--  列表-->
  <TableList
    :tableData="data"
    :pagination="pagination"
    @pageChangeEmit="pageChange"
    @handleEditEmit="handleEdit"
    @handleDeleteEmit="handleDelete"
  ></TableList>

  <!--  新增和编辑的弹框-->
  <!--  <DialogForm-->
  <!--    :visible="visible"-->
  <!--    :data="formData"-->
  <!--    :projectList="projectList"-->
  <!--    @dialogCloseEmit="dialogClose"-->
  <!--    @onFormSubmitEmit="onFormSubmit"-->
  <!--  ></DialogForm>-->
  <!--  护理等级-->
  <NewDialogForm
    :visible="visible"
    :data="formData"
    :planList="planList"
    @dialogCloseEmit="dialogClose"
    @onFormSubmitEmit="onFormSubmit"
  ></NewDialogForm>

  <!--删除弹框-->
  <DeleteDialog
    :visible="deleteVisible"
    @handleClose="handleDeleteClose"
    @handleDelete="handleDeleteClick"
  ></DeleteDialog>

</template>

<script lang="tsx" setup>
import {onMounted, ref} from 'vue'
import {MessagePlugin, TableProps} from 'tdesign-vue-next'
// @ts-ignore
import {searchProject} from './api/NursingPlantApi'
import TableList from './components/TableList.vue'
import SearchForm from './components/SearchForm.vue'
import DeleteDialog from "@/components/OperateDialog/index.vue";

import {
  deleteLevel,
  queryLevelById,
  searchNursingLevel,
  AllNursingPlans, addNursingLevel, updateNursingLevel
} from "@/pages/serve/plan/grade/api/NursingGradeApi";
import NewDialogForm from "@/pages/serve/plan/grade/components/NewDialogForm.vue";

const data = ref([])
const total = ref(28)
const visible = ref(false)
//控制删除的弹框
const deleteVisible = ref(false)
//接收点击删除后的id
const deleteId = ref(null)
const formData = ref({})

const planList = ref([])

const openDialog = () => {
  queryAllNursingPlans()
  visible.value = true
}

const handleEdit = async (id) => {
  //根据id查询数据回显到表单中
  const result = await queryLevelById(id)
  console.log("根据id查询的result的值")
  console.log(result)

  visible.value = true
  if (result.code === 200) {
    formData.value = result.data
    queryAllNursingPlans()
    // title.value = '编辑护理项目'
  } else {
    MessagePlugin.error(result.msg)
  }
}

const dialogClose = () => {
  visible.value = false
}

//点击删除的按钮后
const handleDelete = (id) => {
  deleteVisible.value = true
  deleteId.value = id
}

//关闭删除的弹框
const handleDeleteClose = () => {
  deleteId.value = null
  deleteVisible.value = false
}

//点击确认删除后
const handleDeleteClick = async () => {
  const result = await deleteLevel(deleteId.value)
  if (result.code === 200) {
    MessagePlugin.success("删除成功")
    handleDeleteClose()
    search()
  } else {
    MessagePlugin.error("删除失败")
  }
}

const pagination = ref({
  current: 1,
  pageSize: 2,
  total
})

const layout = ref('inline')

const searchFormData = ref({
  name: '',
  status: '',
});

// 页码发送改变触发
const pageChange = (pageInfo) => {
  pagination.value.current = pageInfo.current
  console.log(pageInfo)
  pagination.value.pageSize = pageInfo.pageSize
  search()
}
//查询请求
const search = async () => {
  const {name, status} = searchFormData.value
  const params = {
    page: pagination.value.current,
    pageSize: pagination.value.pageSize,
    status: searchFormData.value.status == null ? '' : searchFormData.value.status,
    name: searchFormData.value.name
  }
  // 发送请求访问后端接口
  const result = await searchNursingLevel(params)
  if (result.code === 200) {
    // 解析数据渲染页面
    data.value = result.data.records
    // 分页数据总条数
    total.value = result.data.total
  }
}

onMounted(() => {
  search()
})

const onReset = (formData) => {
  searchFormData.value = formData
  search()
};
//点击搜索的按钮执行
const onSubmit = (formData) => {
  searchFormData.value = formData
  pagination.value.current = 1
  search()
};

// 提交新增和编辑的表单数据
const onFormSubmit = async (formData) => {
  console.log("***formdata****")
  console.log(formData)
  console.log(formData.name)
  let result = null
  if (formData.id) {
    // 修改
    result = await updateNursingLevel(formData)
  } else {
    //新增
    result = await addNursingLevel(formData)
  }

  if (result.code === 200) {
    MessagePlugin.success('操作成功')
    // 隐藏弹框
    visible.value = false
    // 加载最新数据
    search()
  } else {
    MessagePlugin.error(result.msg)
  }
}

// 查询所有project 在编辑和新增时下拉框展示
const queryAllNursingPlans = async () => {

  let result = await AllNursingPlans()

  console.log(result)
  if (result.code === 200) {
    result.data.forEach(item => {
      planList.value.push({label: item.planName, value: item.id});
    });
  }
}
</script>
